// jstree icons for different file types
.jstree-icon {
    &.project { background: url(@{tea.dir}../lib/jstree/icons/project.png) 0 0 !important; }
    &.file { background: url(@{tea.dir}../lib/jstree/icons/file.png) 0 0 !important; }
    &.exe,&.bat { background: url(@{tea.dir}../lib/jstree/icons/application.png) 0 0 !important; }
    &.tea { background: url(@{tea.dir}../lib/jstree/icons/code.png) 0 0 !important; }
    &.css { background: url(@{tea.dir}../lib/jstree/icons/css.png) 0 0 !important; }
    &.sql { background: url(@{tea.dir}../lib/jstree/icons/db.png) 0 0 !important; }
    &.doc,&.docx { background: url(@{tea.dir}../lib/jstree/icons/doc.png) 0 0 !important; }
    &.avi,&.mpg,&.mpeg { background: url(@{tea.dir}../lib/jstree/icons/film.png) 0 0 !important; }
    &.swf { background: url(@{tea.dir}../lib/jstree/icons/flash.png) 0 0 !important; }
    &.html,&.htm { background: url(@{tea.dir}../lib/jstree/icons/html.png) 0 0 !important; }
    &.mp3,&.wav { background: url(@{tea.dir}../lib/jstree/icons/music.png) 0 0 !important; }
    &.pdf { background: url(@{tea.dir}../lib/jstree/icons/pdf.png) 0 0 !important; }
    &.php { background: url(@{tea.dir}../lib/jstree/icons/php.png) 0 0 !important; }
    &.jpg,&.png,&.gif { background: url(@{tea.dir}../lib/jstree/icons/picture.png) 0 0 !important; }
    &.ppt,&.pptx { background: url(@{tea.dir}../lib/jstree/icons/ppt.png) 0 0 !important; }
    &.psd { background: url(@{tea.dir}../lib/jstree/icons/psd.png) 0 0 !important; }
    &.rb { background: url(@{tea.dir}../lib/jstree/icons/ruby.png) 0 0 !important; }
    &.js { background: url(@{tea.dir}../lib/jstree/icons/script.png) 0 0 !important; }
    &.txt,&.haml { background: url(@{tea.dir}../lib/jstree/icons/txt.png) 0 0 !important; }
    &.xls,&.xlsx { background: url(@{tea.dir}../lib/jstree/icons/xls.png) 0 0 !important; }
    &.zop { background: url(@{tea.dir}../lib/jstree/icons/zip.png) 0 0 !important; }
}

.CodeMirror .fold-gutter {
    width: 0.8em;
}

#teacss-layer {
    position: absolute;
}

// no outline (not needed for IDE)
.teacss-ui :focus {
    outline: none;
}

// config dialog
.teacss-ui .dayside-config-dialog {
    padding: 0;
    > .ui-dialog-content {
        padding: 0;
        
        > .ui-tabs {
            .ui-tabs-nav {
                background: #eee;
            }
        }
    }
}

// file search
.teacss-ui .file-search-tab {
    overflow: auto;
}

.teacss-ui .file-search-tab a {
    display: block;
    text-decoration: none;
    padding: 3px 5px;
    outline: none;
}

.teacss-ui .file-search-tab a:hover {
    background: #eee;
}

// drop panel icons
.teacss-ui .ui-drop-icons {
    @ var color = '#555';
    @ var hcolor = '#fca';
    @ var size = '40px';

    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -70px;
    margin-top: -22px;
    
    div {
        font-size: @size;
        width: @size;
        height: @size;
        margin:2px;
        line-height: @size;
        display: inline-block;
        border: 1px solid @color;
        color: @color;
        z-index: 100;
        position: relative;
        background: white;
        cursor: pointer;
    }
    
    div.hover,div:hover {
        border: 1px solid @hcolor;
        color: @hcolor;
    }
}

// nested tabs (no border)
.teacss-ui .ui-tabs-panel > div > .ui-tabs {
    border: none;
}

// button inside tab
.teacss-ui ul.ui-tabs-nav li .ui-button-text {
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    height: 1.4em;
}

// scrollable tabs
.teacss-ui .ui-tabs .ui-tabs-nav {
    font-size: 0;
    overflow: hidden;
    white-space:nowrap;
    position: relative;
    border-bottom: none;
}

.teacss-ui .ui-tabs .ui-tabs-nav li {
    float: none;
    display: inline-block;
    font-size: 12px;
    vertical-align: middle;
}

.teacss-ui .ui-tabs .ui-tabs-nav:hover {
    overflow-x: auto;
    z-index: 50000;
}

// button label
.button-label {
    background:white;
    display:inline-block;
    border:1px solid #aaa;
    padding:0 2px;
}

// changed mark on tab ready to save
.teacss-ui .ui-tabs-nav li.changed {
    a {
        color: #000;
        &:after {
            content: " *";
        }
    }
}

// misc
#teacss-layer .adjust-color span {
    display: inline-block;
    width: 20px;
    height: 15px;
    margin-right: 5px;
    border: 1px solid #000;
    vertical-align: middle;
}

.teacss-ui .dayside-statusbar {
    border: 1px solid #ccc;
    background: #eee;
    font-size: 0.8em;
    overflow: hidden;
    white-space: nowrap;
}

// smaller buttons on toolbar
.teacss-ui .editorPanel-toolbar {
    background: #eee;
    padding: 4px 0;
    height: @{27-4*2}px;
    
    .ui-button {
        border: none;
        background: none;
        font-size: 12px;
    }
    
    .ui-button-text-icon-primary .ui-button-text {
        padding: 0.15em 1em 0.15em 2.1em;
    }
    
    .ui-button-text-only .ui-button-text {
        padding: 0.15em 1em 0.15em 1em;
    }
}

// styles for jsTree menu
.teacss-ui.editorPanel,
#vakata-contextmenu
{
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 13px;
    line-height: 18px;
}

.teacss-ui .ui-tabs {
    border: none;
}

.teacss-ui .ui-tabs-nav {
    border-color: transparent;
}

// plupload
/*
   Plupload
------------------------------------------------------------------- */

#teacss-layer .plupload_button {
	cursor: pointer;
	outline: none;
}

#teacss-layer .plupload_wrapper {
	font: normal 11px Verdana,sans-serif;
	width: 100%;
    height: 100%;
	min-width: 520px;
}

#teacss-layer .plupload_container {
	height: 100%;
	min-height: 300px;
	position: relative;
    border: none;
}

#teacss-layer .plupload_filelist_footer {border-width: 1px 0 0 0}
#teacss-layer .plupload_file {border-width: 0 0 1px 0}
#teacss-layer .plupload_container .plupload_header {border-width: 0 0 1px 0; position: relative;background:white;}

#teacss-layer .plupload_delete .ui-icon, 
#teacss-layer .plupload_done .ui-icon,
#teacss-layer .plupload_failed .ui-icon {
	cursor:pointer;	
}

#teacss-layer .plupload_header_content {
	height: 56px;
	padding: 0 160px 0 10px;
	position: relative;
}

#teacss-layer .plupload_logo {
    display: none;
}

#teacss-layer .plupload_header_content_bw .plupload_logo {
	background-position: -40px 0;
}

#teacss-layer .plupload_header_title {
	font: normal 18px sans-serif;
	padding: 6px 0 3px;
}

#teacss-layer .plupload_header_text {
	font: normal 12px sans-serif;
}

#teacss-layer .plupload_view_switch {
	position: absolute;
	right: 16px;
	bottom: 8px;
	margin: 0;
	display: none;
}

#teacss-layer .plupload_view_switch .ui-button {
	margin-right: -0.31em;
}

#teacss-layer .plupload_content {
	position: absolute;
	top: 87px;
	bottom: 44px;
	left: 0;
	right: 0;
	overflow-y: auto;
	width: 100%;
}

#teacss-layer .plupload_filelist {
	border-collapse: collapse;
	border-left: none;
	border-right: none;
	margin: 0;
	padding: 0;
	width: 100%;
	-moz-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}

#teacss-layer .plupload_filelist_content {
	padding: 0;
	margin: 0;
}

#teacss-layer .plupload_cell {padding: 8px 6px;}

#teacss-layer .plupload_file {
	list-style: none;
	display: block;
	position: relative;
	overflow: hidden;
	width: 100%;
}

#teacss-layer .plupload_file_thumb {
	position: absolute;
	left: 6px;
	top: 6px;
	// background: #eee url(../img/loading.gif) center no-repeat;
}

#teacss-layer .plupload_file_thumb_loaded .plupload_file_thumb {
	background-image: none;
}

#teacss-layer .plupload_file_name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#teacss-layer .plupload_filelist_header {
	border-top: none;
}

#teacss-layer .plupload_filelist_footer {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

#teacss-layer .plupload_buttons { 
	position: relative;
}

/* list view */
#teacss-layer .plupload_view_list .plupload_file {
	border-left: none;
	border-right: none;
	border-top: none;
	height: 29px;
}

#teacss-layer .plupload_view_list div.plupload_file_size, 
#teacss-layer .plupload_view_list div.plupload_file_status,
#teacss-layer .plupload_view_list div.plupload_file_action {
	padding: 8px 6px;
	position: absolute;
	top: 0;
	right: 0;
}

#teacss-layer .plupload_view_list div.plupload_file_name {
	margin-right: 156px;
	padding: 8px 6px;
	_width: 75%;
}

#teacss-layer .plupload_view_list div.plupload_file_size {
	right: 28px;
}

#teacss-layer .plupload_view_list div.plupload_file_status {
	right: 82px;
}

#teacss-layer .plupload_view_list .plupload_file_rename {
	margin-left: -2px;
}

#teacss-layer .plupload_view_list .plupload_file_size, 
#teacss-layer .plupload_view_list .plupload_file_status,
#teacss-layer .plupload_filelist_footer .plupload_file_size, 
#teacss-layer .plupload_filelist_footer .plupload_file_status {
	text-align: right; 
	width: 52px;
}

#teacss-layer .plupload_view_list .plupload_file_thumb,
#teacss-layer .plupload_view_list .plupload_file_dummy {
	top: -999px;
}

#teacss-layer .plupload_view_list .plupload_file_progress {
	display: none;
}


/* thumbs view */
#teacss-layer .plupload_view_thumbs .plupload_content {
	top: 57px;
}

#teacss-layer .plupload_view_thumbs .plupload_filelist_header {
	display: none;
}

#teacss-layer .plupload_view_thumbs .plupload_file {
	width: 100px;
	padding: 72px 6px 6px;
	margin: 10px;
	border: 1px solid #fff;
	float: left;
}

#teacss-layer .plupload_view_thumbs .plupload_file_thumb,
#teacss-layer .plupload_view_thumbs .plupload_file_dummy {
	width: 100px;
	height: 60px;
	text-align: center;
	overflow: hidden;
}

#teacss-layer .plupload_view_thumbs .plupload_file_dummy {
	font-size: 21px;
	font-weight: bold;
	text-transform: lowercase;
	overflow: hidden;
	line-height: 60px;
	border: none;
}

#teacss-layer .plupload_view_thumbs div.plupload_file_action {
	position: absolute;
	top: 0;
	right: 0;
}

#teacss-layer .plupload_view_thumbs div.plupload_file_name {
	padding: 0;
	font-weight: bold;
}

#teacss-layer .plupload_view_thumbs .plupload_file_rename {
	padding: 1px 0;
	width: 100% !important;
}

#teacss-layer .plupload_view_thumbs div.plupload_file_size {
	font-size: 0.8em;
	font-weight: normal;
}

#teacss-layer .plupload_view_thumbs div.plupload_file_status {
	position: absolute;
	top: 67px;
	left: 6px;
	width: 100px;
	height: 3px;
	overflow: hidden;
	text-indent: -999px;
}

#teacss-layer .plupload_view_thumbs div.plupload_file_progress {
	border: none;
	height: 100%;
}

#teacss-layer .plupload .ui-sortable-helper,
#teacss-layer .plupload .ui-sortable .plupload_file {
	cursor:move;	
}

#teacss-layer .plupload_file_action {width: 16px;}
#teacss-layer .plupload_file_name {
	overflow: hidden;
	padding-left: 10px;
}

#teacss-layer .plupload_file_rename {
	border: none;
	font: normal 11px Verdana, sans-serif;
	padding: 1px 2px;
	line-height: 11px;
	height: 11px;
}

#teacss-layer .plupload_progress {width: 60px;}
#teacss-layer .plupload_progress_container {padding: 1px;}


/* Floats */

#teacss-layer .plupload_right {float: right;}
#teacss-layer .plupload_left {float: left;}
#teacss-layer .plupload_clear,#teacss-layer .plupload_clearer {clear: both;}
#teacss-layer .plupload_clearer, #teacss-layer .plupload_progress_bar {
	display: block;
	font-size: 0;
	line-height: 0;
}
#teacss-layer .plupload_clearer {height: 0;}

/* Misc */
#teacss-layer .plupload_hidden {display: none;}

#teacss-layer .plupload_droptext {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	text-align: center;
	vertical-align: middle;
	border: 0;
	line-height: 160px;
	display: none;
}

#teacss-layer .plupload_dropbox .plupload_droptext {
	display: block;
}

#teacss-layer .plupload_buttons, #teacss-layer .plupload_upload_status {float: left}

#teacss-layer .plupload_message {
	position: absolute;
	top: -1px;
	left: -1px;	
	height: 100%;
	width: 100%;
}

#teacss-layer .plupload_message p {
	padding:0.7em;
	margin:0;
}

#teacss-layer .plupload_message strong {
	font-weight: bold;	
}

#teacss-layer plupload_message i {
	font-style: italic;	
}

#teacss-layer .plupload_message p span.ui-icon {
	float: left;
	margin-right: 0.3em;	
}

#teacss-layer .plupload_header_content .ui-state-error,
#teacss-layer .plupload_header_content .ui-state-highlight {
	border:none;	
}

#teacss-layer .plupload_message_close {
	position:absolute;
	top:5px;
	right:5px;
	cursor:pointer;	
}

#teacss-layer .plupload .ui-sortable-placeholder {
	height:35px;
}